<!-- 优惠券详情 -->
<template>
	<view class="details">
		<view class="big-box">
			<view class="item">
				<text>卡包名称</text>
				<text>{{name}}</text>
			</view>
			<view class="item">
				<text>发行金额</text>
				<text style="color: #EC5F2F;">¥{{price}}</text>
			</view>
			<view class="item">
				<text>使用场景</text>
				<text>{{scene_label}}</text>
			</view>
			<view class="item">
				<text>商户名称</text>
				<text>{{business_name}}</text>
			</view>
			<view class="item-location">
				<view class="r-tit">
					<text>商户位置</text>
					<view class="r-text">
						<text>{{city}}{{area}}</text>
						<image src="../../../static/images/dinwei.png" mode="aspectFit"></image>
					</view>
				</view>
				<view class="right">
					<text>{{address}}</text>
				</view>

			</view>
			<view class="item">
				<text>使用时间</text>
				<text>{{starttime}} - {{endtime}}</text>
			</view>
			<view class="item">
				<text>商户领取限额</text>
				<text>{{company}}张</text>
			</view>
			<view class="item">
				<text>个人领取限额</text>
				<text>{{person_num}}张</text>
			</view>
			<view class="item">
				<text>券留存数量</text>
				<text>{{retained_num}}张</text>
			</view>
			<view class="item">
				<text>联系电话</text>
				<text @tap="phoneCall">{{link_mobile}}</text>
			</view>
			<view class="sygz-box">
				<text>使用规则</text>
				<view class="item-tit">
					<p>{{rule}}</p>
				</view>
			</view>
			<view class="yhqslt">
				<p>优惠券封面图</p>
				<image :src="fmtSrc" mode="aspectFit"></image>
			</view>
			<view class="yhqslt">
				<p>优惠券缩略图</p>
				<image :src="sltSrc" mode="aspectFit"></image>
			</view>
			<view class="yhqslt">
				<p>优惠券详情图</p>
				<image :src="xqtSrc" mode="aspectFit"></image>
			</view>
			<view class="yhqslt">
				<p>优惠券领取海报</p>
				<image :src="hbSrc" mode="aspectFit"></image>
			</view>

		</view>
		<button v-show="btnTextShow" @click="judge" class="xj">{{btnText}}</button>
		<u-toast ref="uToast" />
	</view>

</template>

<script>
	import {
		shareMixins
	} from '../../../mixins/share.js'
	export default {
		mixins: [shareMixins],
		data() {
			return {
				shareData: {
					title: '空港卡券联盟商户端',
					path: '/pages/mine/mine' // 分享的页面路径
				},
				id: '',
				name: '',
				price: '',
				scene: '',
				scene_label: '', // 使用场景
				province: '',
				street: '',
				lat: '', //经度
				lng: '', //纬度
				total_num: '',
				type: '',
				business_name: '', // 商户名称
				city: '',
				area: '',
				address: '',
				starttime: '',
				endtime: '',
				company: '',
				person_num: '',
				link_mobile: '',
				rule: '',
				fmtSrc: '',
				sltSrc: '',
				xqtSrc: '',
				hbSrc: '',
				retained_num: 0, //留存量
				btnText: '下架',
				btnTextShow: true,
				newDate_s: '', //提交审核的开始时间戳
				newDate_n: '' //提交审核的结束时间戳
			}
		},
		onLoad(e) {
			console.log(e.status_label)
			if (e.status_label == '待提交审核') {
				this.btnText = '提交审核'
			} else if (e.status_label == '下架') {
				this.btnTextShow = false
			}else if (e.status_label == '审核未通过') {
				this.btnTextShow = false
			}else if (e.status_label == '待审核') {
				this.btnTextShow = false
			}else if (e.status_label == '已过期') {
				this.btnTextShow = false
			}else {
				this.btnText = '下架'
			}

			this.id = e.id
			this.getCouponDetail()
		},
		methods: {
			async getCouponDetail() { //获取卡券信息
				const res = await this.$myRequest({
					url: '/api/businessCoupon/getCouponDetail?id=' + this.id
				}).then((res) => {
					this.name = res.data.data.name
					this.price = res.data.data.price
					this.scene_label = res.data.data.scene_label
					this.scene = res.data.data.scene
					this.province = res.data.data.province
					this.street = res.data.data.street
					this.lat = res.data.data.lat, //经度
						this.lng = res.data.data.lng, //纬度
						this.total_num = res.data.data.total_num
					this.type = res.data.data.type
					this.business_name = res.data.data.business_name
					this.city = res.data.data.city
					this.area = res.data.data.area
					this.address = res.data.data.address
					this.company = res.data.data.company_num
					this.person_num = res.data.data.person_num
					this.retained_num = res.data.data.retained_num
					this.link_mobile = res.data.data.link_mobile
					this.rule = res.data.data.rule
					this.fmtSrc = res.data.data.coupon_img_1
					this.sltSrc = res.data.data.coupon_img_2
					this.xqtSrc = res.data.data.coupon_img_3
					this.hbSrc = res.data.data.coupon_img_4
					this.starttime = res.data.data.start_time
					this.endtime = res.data.data.end_time
				})
			},
			judge() { //判断调用下架 还是提交审核方法
				if (this.btnText == '提交审核') {
					this.issueCoupon()
				} else {
					this.undercarriageCoupon()
				}
			},
			async undercarriageCoupon() { //下架卡券
				var data = {
					id: this.id
				}
				const res = await this.$myRequest({
					url: '/api/businessCoupon/undercarriageCoupon' + this.$u.queryParams(data),
					method: 'POST'
				}).then((res) => {
					// console.log(res.data.code)
					if (res.data.code === 200) {
						this.$refs.uToast.show({
							title: '下架成功',
							type: 'success'
						})
						setTimeout(() => {
							uni.navigateTo({
								url: '../Issuecoupons/Issuecoupons'
							})
						}, 1000)
					}
				})
			},
			async issueCoupon() { //提交发行优惠券
				var start_time = (Date.parse(new Date(this.starttime)).toString());
				var end_time = (Date.parse(new Date(this.endtime)).toString());
				this.newDate_s = start_time.substr(0,10);//精确到秒
				this.newDate_n = end_time.substr(0,10);//精确到秒
				var data = {
					id: this.id,
					name: this.name, //卡券名称
					scene: this.scene, //场景
					province: this.province, //省	
					city: this.city, //市
					area: this.area, //区	
					street: this.street, //街道	
					address: this.address, //详细地址
					lat: this.lat, //经度
					lng: this.lng, //纬度
					start_time: this.newDate_s,//开始时间  时间戳
					end_time: this.newDate_n,//结束时间 时间戳 	

					rule: this.rule, //规则
					// link_man: '',//联系人
					link_mobile: this.link_mobile, //联系电话
					price: this.price, //价格
					total_num: this.total_num, //总数
					retained_num: this.retained_num, //留存数量
					person_num: this.person_num, //每人领取限额
					company_num: this.company, //商户领取限额	
					coupon_img_1: this.fmtSrc, //封面图
					coupon_img_2: this.sltSrc, //缩略图	
					coupon_img_3: this.xqtSrc, //详情图
					coupon_img_4: this.hbSrc, //海报图	
					type: this.type, //卡券分类	
					status: 1, //卡券状态  
				}
				const res = await this.$myRequest({
					url: '/api/businessCoupon/issueCoupon' + this.$u.queryParams(data),
					method: 'POST'
				}).then((res) => {
					if (res.data.code === 200) {
						this.$refs.uToast.show({
							title: res.data.msg,
							type: 'success'
						})
						setTimeout(() => {
							uni.navigateBack({
								delta:1
							})
						}, 1000)
					} else {
						this.$refs.uToast.show({
							title: res.data.msg,
							type: 'success'
						})
					}
				})
			},
			phoneCall() { //拨打电话
				var _this = this
				uni.makePhoneCall({
					phoneNumber: _this.link_mobile
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.details {
		padding: 12rpx 32rpx 250rpx 32rpx;
		background: linear-gradient(#FFFBF6, #FFFFFF, #FFFFFF);

		.big-box {
			.item {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 30rpx 0;
				border-bottom: 1px solid #DFDFDF;

				text {
					color: #333333;
					font-size: 32rpx;
				}

				text:nth-child(2) {
					color: #3C4353;
				}
			}

			.item-location {

				border-bottom: 1px solid #DFDFDF;

				.r-tit {
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 30rpx 0;

					.r-text {
						image {
							width: 19rpx;
							height: 27rpx;
							margin-left: 30rpx;
						}

						text {
							font-size: 32rpx;
							color: #3C3C3C;
						}
					}
				}

				.right {
					text-align: right;
					color: #3C3C3C;
					margin-bottom: 16rpx;

					text {
						font-size: 32rpx;
					}
				}
			}

			.sygz-box {
				margin-top: 40rpx;

				text {
					font-size: 32rpx;
					color: #333333;
				}

				.item-tit {
					margin-top: 28rpx;

					p {
						line-height: 40rpx;
					}
				}
			}

			.yhqfmt {
				margin-top: 60rpx;

				p {
					font-size: 32rpx;
					color: #333333;
				}

				image {
					width: 100%;
					height: 252rpx;
					margin-top: 28rpx;
					margin-left: 0;
				}
			}

			.yhqslt {
				margin-top: 60rpx;

				p {
					font-size: 32rpx;
					color: #333333;
				}

				image {
					width: 326rpx;
					height: 268rpx;
					margin-top: 28rpx;
					margin-left: 0;
				}
			}
		}

		.xj {
			margin-top: 120rpx;
			background: linear-gradient(#FFEED9, #FFE7CB, #FFDDB9);
			border-radius: 100rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #731400;
			font-size: 36rpx;
			font-weight: bold;
		}
	}
</style>
